<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>付钱</title>
    <link rel="stylesheet" type="text/css" href="../../css/api.css" />
    <link rel="stylesheet" type="text/css" href="../../css/aui2/aui.css" />
    <style>
    	body{
    		
    	}
    	.panel{
    	   display:block;
    	   height:400px;
    	   color:#0b0b0b;
    	   font-family: "黑体";
    	   font-size: 24px;
    	   background-color: #fff;
    	}
    	.center{
    	   width:100%;
    	   text-align: center;
    	   height:48px;
    	   line-height:48px;
    	   margin-top:12px;
    	}
    	#bean_spend{
    	   font-size: 40px;
    	   color:#C40000;
    	}
    	#bean_has{
    	   font-size: 24px;
           color:#8f8f8f;
    	}
    	.buttons{
    	   margin-top:12px;
    	   height:50px;
    	   display: -webkit-flex;
    	   display: -webkit-box;
    	}
    	.buttons>div{
    	   -webkit-flex:1;
    	   -webkit-box-flex:1;
    	   padding: 0.75rem;
    	}
    </style>
</head>
<body>
	<div class="panel">
        <div id="title" class="center">课程名称：</div>
        <div class="center">该课程需要消耗</div>
        <div id="bean_spend" class="center">学豆：</div>
        <div id="bean_has" class="center">当前余额：</div>
        <div class="buttons">
            <div>
                <div tapmode class="aui-btn aui-btn-success aui-btn-block" onclick="buyCourse();">购买</div>
            </div>
            <div>
                <div tapmode class="aui-btn aui-btn-success aui-btn-block" onclick="deposit();">充值</div>
            </div>
        </div>
	</div>
</body>
<script src="../../script/doT.min.js"></script>
<script data-main="../../script/main" src="../../script/require.js"></script>
<script type="text/javascript">
    var data;
    var token;
	apiready = function(){
		require(["zepto","common"],function(){
            data = api.pageParam.data; 
            $("#title").html("课程名称："+data.course.name);  	
            $("#bean_spend").html("学豆:"+data.course.cost);
            $zb.prefs.getPrefs('token',function(ret){
                token = ret.value;
                var s_data={
                    values:{
                        token:token
                    }
                } 
                $zb.requestForData(s_data,'user','getWallet',function(ret){
                    if(ret&&ret.status=="OK"){
                        $("#bean_has").html("当前余额:"+ret.data.beans);
                    }
                })
            })
		})
	};
	
	function buyCourse(){
        api.confirm({
            msg: '确定购买？',
            buttons: ['确定', '取消']
        },function(ret,err){
            if(ret.buttonIndex==1){
                var s_data = {
                    values:{
                        token:token,
                        course_id: data.course.id
                    }
                }
                $zb.requestForData(s_data,'order','buyCourse',function(ret){
                    if(ret.status!="OK"){
                        api.toast({
	                        msg:ret.status
                        });
                    }else{
                        
                    }
                })
            }
        });
	} 
	
	function refreshBean(){
	    var s_data={
            values:{
                token:token
            }
        } 
        $zb.requestForData(s_data,'user','getWallet',function(ret){
            if(ret&&ret.status=="OK"){
                $("#bean_has").html("当前余额:"+ret.data.beans);
                api.closeWin({
                    name:'deposit_win'
                });
                api.toast({
	                msg:'充值成功'
                });
            }
        })
	}
	
	function deposit(){
	    api.openWin({
	        name: 'deposit_win',
	        url: './deposit_win.html'
        });
	}
</script>
</html>